<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
	<th:block th:include="include :: header('记录处理')" />
</head>
<body class="white-bg">
	<div class="wrapper wrapper-content animated fadeInRight ibox-content">
		<form class="form-horizontal m" id="form-passinfo-edit" th:object="${passInfo}">
			<div class="form-group">
				<label class="col-sm-3 control-label">司机姓名：</label>
				<div class="col-sm-8" style="width: 50%">
					<input class="form-control" type="text"  name="drivername" id="drivername" th:field="*{drivername}" required>
					<span id="spa1"></span>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">联系方式：</label>
				<div class="col-sm-8" style="width: 50%">
					<input class="form-control" type="text"  name="phonenum" id="phonenum" th:field="*{phonenum}" required>
					<span id="spa2"></span>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label ">车牌号码：</label>
				<div class="col-sm-8">
					<input class="form-control" type="text" readonly="readonly" name="license" id="license" th:field="*{license}" >
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">车辆类型：</label>
				<div class="col-sm-8">
					<select name="cartype" id="cartype" th:with="type=${@dict.getType('car_type')}">
						<option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}" th:field="*{cartype}"></option>
					</select>
					&emsp;-种类:&emsp;<select name="carsize" id="carsize" ></select>
				</div>
			</div>
			<input id="passid" name="passid"  type="hidden" th:field="*{passid}" />
			<div class="form-group">
				<label class="col-sm-3 control-label">来访目的：</label>
				<div class="col-sm-8">
					<select name="purpose" id="purpose" th:with="type=${@dict.getType('purpose')}">
						<option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}" th:field="*{purpose}"></option>
					</select>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">进口来访：</label>
				<div class="col-sm-8">
					<select name="destbationid" id="destbationid" th:with="type=${@dict.getType('pass_destbation')}">
						<option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}" th:field="*{destbationid}"></option>
					</select>
					&emsp;-城市:&emsp;<select name="cityid" id="cityid" ></select>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">备注：</label>
				<div class="col-sm-8">
					<input class="form-control" type="text" name="remark" id="remark" th:field="*{remark}" >
				</div>
			</div>
			<input id="belongid" type="hidden" th:value="${passInfo.cartype}" />
			<input id="sizeid" type="hidden" th:value="${passInfo.carsize}" />
			<input id="destid" type="hidden" th:value="${passInfo.destbationid}" />
			<input id="city" type="hidden" th:value="${passInfo.cityid}" />
		</form>
	</div>
	<th:block th:include="include :: footer" />
	<script type="text/javascript">
        var prefix = ctx + "system/passinfo";
        function clearspan() {
            $("#spa1").html("");
            $("#spa2").html("");
        }
        $(function () {
            var carsize = $("#sizeid").val();
            $.post(prefix+"/type",{"belongid":$('#belongid').val()},function (data) {
                for (var i = 0 ;i<data.length;i++){
                    var type = data[i];
                    $("#carsize").append("<option value='"+type.typeid+"'>"+type.typename+"</option>")
                }
                $("#carsize").val(carsize);
            },"json");
            $.post(prefix+"/city",{"destId":$('#destid').val()},function (data) {
                for (var i = 0 ;i<data.length;i++){
                    var city = data[i];
                    $("#cityid").append("<option value='"+city.cityid+"'>"+city.cityname+"</option>")
                }
                $("#cityid").val($("#city").val());
            },"json");
        });
		function submitHandler() {
            var regBox ={
                regMobile : /^0?1[3|4|5|6|7|8][0-9]\d{8}$/
            }
            if($("#drivername").val()==null || $("#drivername").val()==""){
                clearspan();
                $("#spa1").html("请输入姓名");
                $("#spa1").css("color","red");
            }else if($("#phonenum").valid()==null||$("#phonenum").val()==""||!regBox.regMobile.test($("#phonenum").val())) {
                clearspan();
                $("#spa2").html("电话号码为空或输入有误");
                $("#spa2").css("color","red");
            }else {
                var formData = {
                    "passid": $("#passid").val(),
                    "drivername": $("#drivername").val(),
                    "phonenum": $("#phonenum").val(),
                    "license": $("#license").val(),
                    "cartype": $("#cartype").val(),
                    "carsize": $("#carsize").val(),
                    "purpose": $("#purpose").val(),
                    "destbationid": $("#destbationid").val(),
                    "cityid": $("#cityid").val(),
                    "remark": $("#remark").val()
                };
                console.log(formData);
                $.operate.save(prefix + "/edit", formData);
            }
	    }
        $('#cartype').change(function a() {
			var belongid = $('#cartype').val();
			$('#carsize option').remove();
			if(belongid!=''){
                $.post(prefix+"/type",{"belongid":belongid},function (data) {
                    for (var i = 0 ;i<data.length;i++){
                        var type = data[i];
                        $("#carsize").append("<option value='"+type.typeid+"'>"+type.typename+"</option>")
                    }
                    if(belongid==3)
                        $("#carsize").val(7);
                    else
                        $("#carsize").val(1);
                },"json")
			}
        });
		$('#destbationid').change(function a() {
			var destid = $('#destbationid').val();
			$('#cityid option').remove();
			if(destid!=''){
			    $.post(prefix+"/city",{"destId":destid},function (data) {
                    for (var i = 0 ;i<data.length;i++){
                        var city = data[i];
                        $("#cityid").append("<option value='"+city.cityid+"'>"+city.cityname+"</option>")
                    }
                    $("#cityid").val(1);
                },"json");
			}
        });
	</script>
</body>
</html>
